<!DOCTYPE html>
<html xmlns:ks="" xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>咨询</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<script src="../js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/axios-0.19.2/axios.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<style>
			.border1Content{
				height: 100% !important;
			}
			#sendMsgDiv{
				margin-right: 125px;
			}
		</style>
	</head>
	<body onkeydown="" onload="" scroll="no"><audio id="sound1" preload="auto" src=""></audio>
		<base target="_blank">
		<link href="../css/lrchatBW.css" rel="stylesheet" type="text/css">
		<div id="toolsbar1" style="height: 264px; left: 11px; display: none; z-index: 999; bottom: 168px;"></div>
		<div style="position: absolute; top: 0px; display: block;background-color:#4e9b3a;" id="header">
			<div id="headerBox" class="toptitle">
				<p id="prompttop" style="margin-left:50px;">&nbsp;心理网</p>
			</div>
			<div id="topclose" class="topclose" onclick="closeme()">结束对话</div>
		</div>
		<div id="centerMsg" style="position: relative; margin-right: 125px; margin-left: 0px; height: 100%;">
			<div id="chatOutput" style="bottom: 165px;top: 54px;position: absolute;">
				<div id="pmtdiv" style="display:none;"></div>
				</div>
				<div style="position: relative; height: 718px;" class="border1Content" id="chatContent">
					<div id="msgArea">
						<div id="welcom1">
							<div>
								<p>&nbsp;</p>
								<p class="MsoNormal"><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">欢迎来到心理服务平台</font>
									</span><span style="FONT-FAMILY: 微软雅黑; COLOR: rgb(0,0,0); FONT-SIZE: 10.5pt; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt"></span></p>
								<p class="MsoNormal"><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">本心理服务平现已拥有</font>
									</span><b><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(255,0,0); FONT-SIZE: 16px; FONT-WEIGHT: bold; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">80</span></b><b><span
										 style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(255,0,0); FONT-SIZE: 16px; FONT-WEIGHT: bold; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">0</span></b><b><span
										 style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(255,0,0); FONT-SIZE: 16px; FONT-WEIGHT: bold; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
											<font face="微软雅黑">万</font>
										</span></b><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">注册用户和超过</font>
									</span><b><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(255,0,0); FONT-SIZE: 16px; FONT-WEIGHT: bold; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">15000+</span></b><span
									 style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">名入驻专业心理咨询师，已累计向近</font>
									</span><b><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(255,0,0); FONT-SIZE: 16px; FONT-WEIGHT: bold; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">100万</span></b><span
									 style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">人</font>
									</span><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">，</font>
									</span><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">平台用户满意度达到</font>
									</span><b><span style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(255,0,0); FONT-SIZE: 16px; FONT-WEIGHT: bold; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">99%</span></b><span
									 style="FONT-FAMILY: Microsoft YaHei; COLOR: rgb(0,0,0); FONT-SIZE: 16px; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt">
										<font face="微软雅黑">，真正肩负起维护心理健康、提升心理素质、促进社会适应的重要使命。</font>
									</span><span style="FONT-FAMILY: 微软雅黑; COLOR: rgb(0,0,0); FONT-SIZE: 10.5pt; mso-spacerun: 'yes'; mso-font-kerning: 0.0000pt"></span></p>
							</div>
							<div id="servicekindlist">
								<p>&nbsp;</p>
							</div>
						</div>
						<div class="msg-box" id="lr_msg1273547">
							<div class="msg-agent">
								<div class="agent-avatar"><img src="http://dat.zoosnet.net/lr/newMobile/avatar2.png" style="width:36px;"></div>
								<div class="arrow_box_left" style="margin-left:10px;">
									<div class="text1">小心心</div>
									<div class="text">
										<p><img onload="" style="CURSOR: pointer" border="0" alt="" src="http://testserver.zoosnet.net/lr/headimg1/1.gif">您好!&nbsp;很感谢您对我们的信任，我是您的专属客服：瑞佳<br>我们擅长处理婚姻情感、亲子教育、青少年成长、情绪压力、自我成长、职场人际、家庭关系、抑郁、焦虑、强迫等方面心理问题。</p>
										<p>
											<font size="4">电话</font>：<font color="red" size="5">18667927572<font size="4">(微信同号）</font>
											</font>
										</p>
									</div>
								</div>
							</div>
						</div>
						
						<div class="msg-box" id="lr_msg1273573">
							<div class="msg-agent">
								<div class="agent-avatar"><img src="http://dat.zoosnet.net/lr/newMobile/avatar2.png" style="width:36px;"></div>
								<div class="arrow_box_left" style="margin-left:10px;">
									<div class="text1">小心心</div>
									<div class="text">
										<p>
											<font size="2">您好，请问您是想咨询哪方面的问题呢？</font>
										</p>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="kongge_msg"></div>
				</div>
			</div>
			<div id="userOptiv">
				<div class="border1Content">
					<div style="background-color:#f1f1f1;"></div>
					<div style="background-color:#f1f1f1;">
						<div id="toolsbar">
							<div unselectable="on" class="panelContain">
								<div unselectable="on" id="tbut0" class="toolbutton0" title="设置字体">
									<div class="toolbutton" style="background-position: -600px -50px;" onmouseover="showC1(-600, this)" onmouseout="hiddenC1(-600, this);"
									 onclick="showContent(0)" title="设置字体"></div>
								</div>
								<div unselectable="on" style="display:" class="toolbutton0" title="发送表情">
									<div class="toolbutton" style="background-position:0px -50px;" onmouseover="showC1(0, this)" onmouseout="hiddenC1(0, this);"
									 onclick="showContent(1)" title="发送表情"></div>
								</div>
								<div unselectable="on" id="tbut3" style="display:none" class="toolbutton0" title="点击QQ交谈">
									<div class="toolbutton" style="background-position:-650px -50px" onmouseover="showC1(-650, this)" onmouseout="hiddenC1(-650, this)"
									 title="点击QQ交谈"><a href="tencent://message/?uin=&amp;Site=&amp;Menu=yes" style="width: 26px; height: 24px;display:block;"
										 id="tbut3h"></a></div>
								</div>
								<div unselectable="on" style="display:" class="toolbutton0" title="发送图片">
									<div class="toolbutton" style="background-position:-100px -50px" onmouseover="showC1(-100, this)" onmouseout="hiddenC1(-100, this);"
									 onclick="showContent(2)" title="发送图片"></div>
								</div>
								<div unselectable="on" style="display:" class="toolbutton0" title="发送文件">
									<div class="toolbutton" style="background-position:-250px -50px" onmouseover="showC1(-250, this)" onmouseout="hiddenC1(-250, this);"
									 onclick="showContent(3)" title="发送文件"></div>
								</div>
								<div unselectable="on" style="display:none" class="toolbutton0" title="截图发送">
									<div class="toolbutton" style="background-position:-300px -50px" onmouseover="showC1(-300, this)" onmouseout="hiddenC1(-300, this);"
									 onclick="Capture();" title="截图发送"></div>
								</div>
								<div unselectable="on" style="display:" class="toolbutton0" title="保存聊天记录">
									<div class="toolbutton" style="background-position:-150px -50px" onmouseover="showC1(-150, this)" onmouseout="hiddenC1(-150, this);"
									 onclick="savechat()" title="保存聊天记录"></div>
								</div>
								<div unselectable="on" style="display:" class="toolbutton0" title="在线留言">
									<div class="toolbutton" style="background-position: -500px -50px;" onmouseover="showC1(-500, this)" onmouseout="hiddenC1(-500, this)"
									 title="在线留言"><a onmousedown="liuyan();" style="width: 26px; height: 24px;display:block;"></a></div>
								</div>
							</div>
						</div>
					</div>
					<div id="sendMsgDiv">
						<div class="editor_border">
							<div id="lreditor"><textarea id="msgToSend" style="width: 100%;height: 100%;" placeholder="请在此处输入文本"></textarea></div>
						</div>
						<div id="promptbar">
							<div style="overflow:hidden;height:22px;line-height:20px;width:100%;margin-top:13px;">
								<ul id="promptbottom">
									
								</ul>
							</div>
						</div>
						<div unselectable="on" id="SendBar">
							<div class="bd1">
								
								<div onmouseover="filter0(this);" onmouseout="filter1(this);" unselectable="on"
								 class="bt" id="SendBtn" style="background : #5ba4ed none repeat scroll 0 0;">发 送</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="leftDiv" style="position: absolute; width: 170px; height: 883px; left: 0px; top: 54px; background-color: rgb(255, 255, 255); overflow: hidden; display: none;"></div>
		<div id="rightDiv" style="position: absolute; width: 125px; height: 100%; right: 0px; top:0px; background-color: rgb(255, 255, 255); overflow: hidden;display:">
			<div id="rightLogo" style="position: absolute; bottom: 0px; height: 130px; background-color: rgb(255, 255, 255); width: 100%;display:none"><a
				 href="http://www.zoosnet.net/" target="_blank"><img src="https://dat.zoosnet.net/lr/bimg/rblogo.jpg" border="0"
					 width="125" height="130"></a></div>
		</div>
	</body>
	<script>
		(function() {
			var layer = null
			var form = null;
			layui.use(['layer', 'form'], function () {
				layer = layui.layer;
				form = layui.form;
			});
		})();
		function filter0(obj){
			$(obj).css("background","#4e9b3a none repeat scroll 0 0");
		}
		function filter1(obj){
			$(obj).css("background","#5ba4ed none repeat scroll 0 0");
		}
		$('#SendBtn').on('click',function(){
			sendMsg();
		})
		$(document).keydown(function(event){
			if(event.keyCode==13){
				sendMsg();
			}
		});
		function sendMsg(){
			var question = $('#msgToSend').val();
			$('#msgToSend').val('');
			askQuestion(question);
			$.ajax({
				url:'/ask/askQuestion.json',
				type:'post',
				data:{
					question:question
				},
				dataType:'json',
				success:function(result){
					if(result.success){
						var msg = result.data;
						setTimeout(function(){receiveAnser(msg)},2000);
						//window.setTimeOut(receiveAnser(msg),6000);
						// layer.msg('', {
						// 	time: 2000 //2秒关闭
						// }, function(){
						// 	receiveAnser(msg);
						// });
					}
				}
			})
		}
		function closeme(){
			window.location.href = "/";
		}
		
		//发送消息
		function askQuestion(msg){
			if(msg){
				var rand = parseInt(Math.random() * 100000);
				var sendMsgHtml = '';
				sendMsgHtml += '<div class="msg-box" id="lr_'+rand+'">';
				sendMsgHtml += '<div class="msg-client">';
				sendMsgHtml += '<div class="client-avatar"><img src="http://dat.zoosnet.net/lr/newMobile/avatar2.png" style="width:36px;"></div>';
				sendMsgHtml += '<div class="arrow_box" style="margin-right:45px;">';
				sendMsgHtml += '<div class="text">';
				sendMsgHtml += '<div style="font-family: 微软雅黑; font-weight: normal; font-style: normal; font-size: 12pt; text-decoration: none; ">';
				sendMsgHtml += msg;
				sendMsgHtml += '</div></div></div></div></div>';
				$('#msgArea').append(sendMsgHtml);
				window.location.href='#lr_'+rand;
			}else{
				layer.alert('发送内容不能为空')
			}
		}
		//接收消息
		function receiveAnser(msg){
			if(msg){
				var rand = parseInt(Math.random() * 100000);
				var sendMsgHtml = '';
				sendMsgHtml += '<div class="msg-box" id="lr_'+rand+'">';
				sendMsgHtml += '<div class="msg-agent">';
				sendMsgHtml += '<div class="agent-avatar"><img src="http://dat.zoosnet.net/lr/newMobile/avatar2.png" style="width:36px;"></div>';
				sendMsgHtml += '<div class="arrow_box_left" style="margin-left:10px;">';
				sendMsgHtml += '<div class="text1">小心心</div>';
				sendMsgHtml += '<div class="text"><p><font size="2">';
				sendMsgHtml += msg;
				sendMsgHtml += '</font></p></div></div></div></div>';
				$('#msgArea').append(sendMsgHtml);
				window.location.href='#lr_'+rand;
			}else{
				console.log("接收到的消息为空！")
			}
		}
	</script>
</html>
